<!--学员奖励信息 修改-->
<template>
	<div>
        <div class="marginLeftRight">
            <div class="my-form-container" style="height:482px">
                <el-form ref="dataForm" :model="dataForm" :rules="rules" class="demo-ruleForm">
                    <el-row class="my-form-item">
                        <el-col :span="12">
                            <div class="my-form-item-label">学&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;号</div>
                            <div class="my-form-item-value" v-if="type==2">{{dataForm.studentCode}}</div>
                            <div class="my-form-item-value editImg" v-else>
                                {{dataForm.studentCode}}
                                <img src="../../../../assets/assessment/icon-plan-record-detail.png" @click="choseDialog">
                            </div>
                        </el-col>
                        <el-col :span="12">
                            <div class="my-form-item-label">姓&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;名</div>
                            <div class="my-form-item-value">{{dataForm.studentName}}</div>
                        </el-col>
                    </el-row>
                    <el-row class="my-form-item">
                        <el-col :span="12">
                            <div class="my-form-item-label">性&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;别</div>
                            <div class="my-form-item-value">{{dataForm.gender}}</div>
                        </el-col>
                        <el-col :span="12">
                            <div class="my-form-item-label">学&nbsp;员&nbsp;队</div>
                            <div class="my-form-item-value">{{dataForm.studentdui}}</div>
                        </el-col>
                    </el-row>
                    <el-row class="my-form-item">
                        <el-col :span="12">
                            <div class="my-form-item-label">专业班次</div>
                            <div class="my-form-item-value">{{dataForm.specialtyClassName}}</div>
                        </el-col>
                        <el-col :span="12">
                            <div class="my-form-item-label">获奖名称</div>
                            <el-form-item  prop="rdname" v-if="type==1">
                                <div class="my-form-item-value">
                                    <el-input class="inputWidth" v-model="dataForm.rdname"></el-input>
                                </div>
                            </el-form-item>
                            <div class="my-form-item-value" v-else>{{dataForm.rdname}}</div>
                        </el-col>
                    </el-row>
                    <el-row class="my-form-item">
                        <el-col :span="12">
                            <div class="my-form-item-label">奖励类别</div>
                            <el-form-item  prop="rdtype" v-if="type==1">
                                <div class="my-form-item-value">
                                    <el-select class="inputWidth158" v-model="dataForm.rdtype">
                                        <el-option
                                            v-for="item in optionsJL"
                                            :key="item.typeid"
                                            :label="item.typename"
                                            :value="item.typeid">
                                        </el-option>
                                    </el-select>
                                </div>
                            </el-form-item>
                            <div class="my-form-item-value" v-else>{{dataForm.rdtypeName}}</div>
                        </el-col>
                        <el-col :span="12">
                            <div class="my-form-item-label">奖励级别</div>
                            <el-form-item  prop="grade" v-if="type==1">
                                <div class="my-form-item-value">
                                    <el-select class="inputWidth158" v-model="dataForm.grade">
                                        <el-option
                                            v-for="item in optionsJB"
                                            :key="item.gradeid"
                                            :label="item.gradename"
                                            :value="item.gradeid">
                                        </el-option>
                                    </el-select>
                                </div>
                            </el-form-item>
                            <div class="my-form-item-value" v-else>{{dataForm.gradeName}}</div>
                        </el-col>
                    </el-row>
                    <el-row class="my-form-item">
                        <el-col :span="12">
                            <div class="my-form-item-label">奖励金额</div>
                            <el-form-item  prop="money" v-if="type==1">
                                <div class="my-form-item-value">
                                    <el-input class="inputWidth145" v-model="dataForm.money"></el-input>&nbsp;&nbsp;(单位：元)
                                </div>
                            </el-form-item>
                            <div class="my-form-item-value" v-else>{{dataForm.money}}</div>
                        </el-col>
                        <el-col :span="12">
                            <div class="my-form-item-label">奖励文件号</div>
                            <el-form-item  prop="fileno" v-if="type==1">
                                <div class="my-form-item-value">
                                    <el-input class="inputWidth" v-model="dataForm.fileno"></el-input>
                                </div>
                            </el-form-item>
                            <div class="my-form-item-value" v-else>{{dataForm.fileno}}</div>
                        </el-col>
                    </el-row>
                    <el-row class="my-form-item">
                        <el-col :span="12">
                            <div class="my-form-item-label">奖励单位</div>
                            <el-form-item  prop="company" v-if="type==1">
                                <div class="my-form-item-value">
                                    <el-input class="inputWidth" v-model="dataForm.company"></el-input>
                                </div>
                            </el-form-item>
                            <div class="my-form-item-value" v-else>{{dataForm.company}}</div>
                        </el-col>
                        <el-col :span="12">
                            <div class="my-form-item-label" >获奖日期</div>
                            <el-form-item  prop="rddate" v-if="type==1">
                                <div class="my-form-item-value">
                                    <el-date-picker class="time" v-model="dataForm.rddate" type="date" value-format="yyyy-MM-dd"></el-date-picker>
                                </div>
                            </el-form-item>
                            <div class="my-form-item-value" v-else>{{dataForm.rddate}}</div>
                        </el-col>
                    </el-row>
                    <el-row class="my-form-item">
                        <el-col :span="12">
                            <div class="my-form-item-label">获奖文件</div>
                            <el-form-item  prop="rdfile" v-if="type==1">
                                <div class="my-form-item-value">
                                    <el-input class="inputWidth" v-model="dataForm.rdfile"></el-input>
                                </div>
                            </el-form-item>
                            <div v-else class="my-form-item-value">{{dataForm.rdfile}}</div>
                        </el-col>
                        <el-col :span="12">
                            <div class="my-form-item-label">发文日期</div>
                            <el-form-item  prop="senddate"  v-if="type==1">
                                <div class="my-form-item-value">
                                    <el-date-picker class="time" v-model="dataForm.senddate" type="date" value-format="yyyy-MM-dd"></el-date-picker>
                                </div>
                            </el-form-item>
                            <div v-else class="my-form-item-value">{{dataForm.senddate}}</div>
                        </el-col>
                    </el-row>
                    <el-row class="my-form-item" style="border:none">
                        <el-col :span="12">
                            <div class="my-form-item-label">奖励原因</div>
                            <el-form-item  prop="reason" v-if="type==1">
                                <div class="my-form-item-value">
                                    <el-input class="inputWidth" v-model="dataForm.reason"></el-input>
                                </div>
                            </el-form-item>
                            <div v-else class="my-form-item-value">{{dataForm.reason}}</div>
                        </el-col>
                        <el-col :span="12">
                            <div class="my-form-item-label">附件</div>
                            <el-form-item  prop="enclosure" v-if="type==1">
                                <div class="my-form-item-value">
                                    <el-upload
                                        action="string"
                                        :show-file-list="false"
                                        :http-request="upLoadApi"
                                        accept=".jpg,.png,.doc,.docx"
                                        :before-upload="beforeAvatarUpload">
                                        <span class="small-btn" type="primary">选择文件</span>
                                    </el-upload>
                                </div>
                            </el-form-item>
                            <div v-else class="my-form-item-value">{{dataForm.enclosure}}</div>
                        </el-col>
                    </el-row>
                </el-form>
            </div>
            <div class="button-group">
                <div class="" @click="save" v-show="type==1">保存</div>
                <div class="" @click="cancel">取消</div>
            </div>
        </div>
         <!-- 选择学员 -->
        <chose-student ref="choseDialog" @choseXY="getStudent"></chose-student>
	</div>
</template>

<script>
import {rewardDetail,updateRewardDetail} from "@/api/student";
import ChoseStudent from '@/components/choseStudent';
  import axios from 'axios'

  export default {
		data(){
		  return {
            optionsJL:[],//奖励类别
            optionsJB:[],//奖励级别
            dataForm:{
                // studentCode:'',//学号
                // gender:'',//性别
                // studentName:'',//学生姓名
                // studentId:'',
                // studentdui:'',//学员队
                // specialtyClassName:'',//专业班次
                // rdname:'',//获奖名称
                // rdtype:'',//奖励类别
                // grade:'',//奖励级别
                // money:'',//奖励金额
                // fileno:'',//奖励文件号
                // company:'',//奖励单位
                // rddate:'',//获奖日期
                // senddate:'',//发文日期
                // reason:'',//奖励原因
                enclosure:''//附件
            },
            rules: {
                studentCode: [
                    { required: true, message: '请填写学号', trigger: 'blur' }
                ],
                gender: [
                    { required: true, message: '请填写性别', trigger: 'blur' }
                ],
                studentName: [
                    { required: true, message: '请填写学生姓名', trigger: 'blur' }
                ],
                studentdui: [
                    { required: true, message: '请填写学员队', trigger: 'blur' }
                ],
                specialtyClassName: [
                    { required: true, message: '请填写专业班次', trigger: 'blur' }
                ],
                rdname: [
                    { required: true, message: '请填写学号获奖名称', trigger: 'blur' }
                ],
                rdtype: [
                    { required: true, message: '请选择奖励类别', trigger: 'change' }
                ],
                money: [
                    { required: true, message: '请填写奖金金额', trigger: 'blur' }
                ],
                fileno: [
                    { required: true, message: '请填写奖励文件号', trigger: 'blur' }
                ],
                company: [
                    { required: true, message: '请填写奖励单位', trigger: 'blur' }
                ],
                rddate: [
                    { required: true, message: '请选择获奖日期', trigger: 'change' }
                ],
                senddate: [
                    { required: true, message: '请选择发文日期', trigger: 'change' }
                ],
                reason: [
                    { required: true, message: '请填写奖励原因', trigger: 'change' }
                ],
                grade: [
                    { required: true, message: '请填写奖励级别', trigger: 'change' }
                ]
            },
            type:1//2:查看1：修改
          }
		},
        components: {ChoseStudent},
        mounted(){
            this.type = this.$route.query.type;
            this.getDetail()
            //奖励类别
            this.commonApi.getRewardTypeList().then(res=>{
            this.optionsJL = res.records
            })
            //奖励级别
            this.commonApi.getGradeList().then(res=>{
            this.optionsJB = res.records
            })
        },
        methods: {
            async getDetail(){
                let res = await rewardDetail({rwid:this.$route.query.rwid});
                this.dataForm = {
                    ...res.data.rewardInfoVO,
                    ...res.data.studentInfoVO
                }
            },
            getStudent(e){
                this.$set(this.dataForm,'studentCode',e.studentCode)
                this.$set(this.dataForm,'studentId',e.id)
            },
            //选择学员
            choseDialog(){
                this.$refs.choseDialog.dialogVisible = true
            },
            //保存数据
            save(){
                this.$refs['dataForm'].validate(async(valid) => {
                    if (valid) {
                        let res = await updateRewardDetail(this.dataForm);
                        if(res.code == 200){
                            this.$message.success('保存成功！');
                            this.$router.push({
                                path:'/student/disciplinaryInfo/reward/list'
                            })
                        }
                    } 
                });
            },
            //取消
            cancel(){
                this.$router.push({
                    path:'/student/disciplinaryInfo/reward/list'
                })
            },
            upLoadApi(item){
                let formData = new FormData();
                formData.append('file', item.file);
                let requestUrl = this.$store.state.studentUrl.baseUrl+'/file/upload'
                axios.post(requestUrl,formData).then(res => {
                    if(res.data.success){
                        this.dataForm.enclosure = res.data.data.fileUri;
                        this.$message.success('上传成功！')
                    }
                })
            },
            beforeAvatarUpload(item){
                if(item.name.indexOf("doc") == -1 && item.name.indexOf("docx") == -1&& item.name.indexOf("jpg") == -1 && item.name.indexOf("png") == -1){
                    this.$message.error('请上传图片或word');
                }
            },
        }
  };
</script>
<style scoped lang="less" scoped>
@import "../../../../styles/commonCss.less";
    /deep/.demo-ruleForm{
        .el-form-item{
            margin-bottom: 0!important;
            width: 100%;
        }
        .el-form-item__error {
            top: 75%;
            left: 42px;
        }
    }
    /deep/.my-form-item-label{justify-content: center;padding: 0!important;}
	.inputWidth{width: 244px;}
    .inputWidth158{width: 158px;}
    .inputWidth145{width: 145px;}
    .editImg{
        display: flex;
        align-items: center;
        img{
            width:20px ;
            height: 20px;
            margin-left: 15px;
            cursor: pointer;
        }
    }
    .time{
        width: 156px;
        /deep/.el-input__inner{
            height: 36px;
            line-height: 36px;
        }
        /deep/.el-input__icon{
            font-size: 20px;
            margin-top: 3px;
        }
        /deep/.el-input__prefix{
            right: 16px;
        }
    }
    .small-btn{
        display: flex;
        align-items: center;
        padding: 5px 19px;
        opacity: 1;
        border-radius: 6px;
        background: #EFEBFF;
        border: 1px solid #5230E9;
        color: #5230E9 ;
        font-size: 14px;
        width: 96px;
        height: 27px;
        cursor: pointer;
    }
	.button-group {
		margin-top: 68px;
		padding-bottom: 132px;
		text-align: center;
		> div {
			display: inline-block;
			font-size: 16px;
			padding: 6px 22px;
			border-radius: 6px;
			cursor: pointer;
			&:nth-child(1) {
				color: #F3B815;
				border: 1px solid #F3B815;
				background: #FFF6EF;
				margin-right: 187px;
			}
			&:nth-child(2) {
				color:#FF3819;
				background: #FFEFEF;
				border: 1px solid #FF3819;
			}
		}
	}
</style>